<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

	<head>
		<meta http-equiv="content-type" content="text/html;charset=utf-8" />
		<meta name="generator" content="Adobe GoLive" />
		<title>您的网站</title>
		<style>
			body{
				background:yellow;
			}
			.dish{
				position: absolute;
				width:300px;
				height:300px;
			}
			.page{
				position: absolute;
				width:100%;
				height: 600px;
			}
			.left{
				background:red;
				left:200px;
			}
			.right{
				background:green;
				right:200px;
			}
			.desk{
				width:300px;
				height:120px;
				overflow: hidden;
				border: 1px solid #ccc;
				margin-top:700px;
				
			}
			.desk ul{
				position:relative;
				margin:0px;
				padding:0px;
				list-style: none;
				width:1200px;
			}
			.desk li{
				float:left;
				display:inline-block;
				width:300px;
			}
			.btn{
				position: absolute;
				top:50px;
				z-index: 999;
			}
		</style>
		
	</head>

	<body>
		<div id="page"></div>
		<div id='dish'>
			
		</div>
		<!--<div  class="desk">
			<ul id="desk">
					<li>a</li>
					<li>b</li>
					<li>c</li>
					<li>d</li>
			</ul>
		</div>
		<div style="margin-top: 100px;">
		<a href="javascript:void(0);" onclick="test(this)">1</a>
		<a href="javascript:void(0);" onclick="test(this)">2</a>
		<a href="javascript:void(0);" onclick="test(this)">3</a>
		<a href="javascript:void(0);" onclick="test(this)">4</a>
		</div>-->
		<img src="images/btn.png" id="img" onclick="test2(this)" class='btn' />
	</body>
	<script type="text/tmpl" id="tmpl_page">
		<%=current%>/<%=total%>
	</script>
	<script type="text/tmpl" id="tmpl_dish">
			<div pos="left" class="dish left" dish='<%=dish_id_0%>'>
				
				左边<%=dish_id_0%>,<%=dish_name_0%>,<%=dish_family_0%>
			</div>
			<div pos="right" class="dish right"  dish='<%=dish_id_1%>'>
				右边<%=dish_id_1%>,<%=dish_name_1%>,<%=dish_family_1%>
				
			</div>
	</script>
	<script src="scripts/core.js"></script>
	<script src="scripts/food.js" action='dish'></script>
	<script>
			function test(elem){
				$('desk').desk(300,elem.innerHTML);
			}
			function test2(elem){
				$(elem).transition(null,'ease-in').css('top','400px').css('left','200px');
				setTimeout(function(){
					$(elem).totate(30)
				},600)
			}
	</script>
</html>